<template>
  <div class="movie_body">
    <Loading v-if="isLoading" />
    <Scroll v-else :pulldown="true" @pulldown="loadData">
    <ul>
      <!-- <li>
        <div class="pic_show"><img src="/images/movie_1.jpg"></div>
        <div class="info_list">
          <h2>无名之辈</h2>
          <p><span class="person">17746</span> 人想看</p>
          <p>主演: 陈建斌,任素汐,潘斌龙</p>
          <p>2018-11-30上映</p>
        </div>
        <div class="btn_pre">
          预售
        </div>
      </li> -->
      <li v-for="item in comingList" :key="item.id">
        <div class="pic_show" @tap="showOutDetail(item.id)"><img :src="item.img | setWH('128.180')"></div>
        <div class="info_list">
          <h2 @tap="showOutDetail(item.id)">{{item.nm}} <img v-if="item.version" src="@/assets/images/maxs.png" /></h2>
          <p><span class="person">{{ item.wish }}</span> 人想看</p>
          <p>主演: {{ item.star }}</p>
          <p>{{ item.rt }}上映</p>
        </div>
        <div class="btn_pre">
          预售
        </div>
      </li>
    </ul>
    </Scroll>
  </div>
</template>

<script>
  import { getComingSoon } from '@/api/api'
  export default {
    name: 'comingsoon',
    data() {
      return {
        comingList: [],
        isLoading: true,
        preCityId: -1
      }
    },
    activated() {
      let cityId = this.$store.state.city.id
      if(this.prevCityId === cityId) return
      this.loadData()
    },
    methods: {
      loadData() {
        this.isLoading = true
        let cityId = this.$store.state.city.id
        getComingSoon(null, { cityId }).then(res => {
          let resData = res.data
          this.isLoading = false
          if (resData.msg === 'ok') {
            this.comingList = resData.data.comingList
            this.prevCityId = cityId
          }
        })
      },
      showOutDetail(id) { // 跳转到详情页
        this.$router.push('/movie/detail/2/'+id)
      }
    }
  }
</script>
